﻿<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        div {
            width: 300px;
            height: 300px;
            margin: 0 auto;
            background-color: red;
        }
        .show {
            visibility: visible;
        }
        .hidden {
            visibility: hidden;
        }
    </style>
</head>
<body>
    <input type="button" name="name" value="按钮" />
    <div class="show"></div>

    <script>
        var btn = document.querySelector('input');
        btn.onclick = function () {
            var div = document.querySelector('div')
            if (div.className == 'show') {
                div.className = 'hidden';
            } else {
                div.className = 'show';
            }
        }
    </script>
</body>
</html>